<template>
  <div>
    <el-container>
      <!--       aside -->
      <!--      100vh为整个窗口高度-->
      <el-aside style="width:200px; min-height: 100vh;background-color: #001529">
        <div style="height: 60px; color: aliceblue; display: flex; align-items: center;justify-content: center" >
          <img :src="require('@/assets/library.jpg')" style="height: 80%;">
        </div>
        <!--        侧边导航栏-->

        <el-menu style="border: none" :default-active="$route.path" router background-color="#001529" text-color="rgba(255,255,255,0.65)" active-text-color="#FFF">
          <el-menu-item index="/login">
            <template slot="title">
              <i class="el-icon-house"></i>
              <span>登录界面</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/home">
            <template slot="title">
              <i class="el-icon-s-marketing"></i>
              <span>系统首页</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/about">
            <template slot="title">
              <i class="el-icon-house"></i>
              <span>关于我们</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/product">
            <template slot="title">
              <i class="el-icon-house"></i>
              <span>书籍管理</span>
            </template>
          </el-menu-item>
          <el-submenu>
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>信息管理</span>
            </template>
            <el-menu-item>用户信息</el-menu-item>
            <el-menu-item>管理员信息</el-menu-item>
          </el-submenu>
        </el-menu>
      </el-aside>


      <el-container>
        <!-- header -->
        <el-header>
          header
        </el-header>

        <!-- main -->
        <el-main>
          main
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<style>

</style>

<script>
export default {
  name:'MainView'
};
</script>